<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<title>收件交单扫描</title>
	<meta name="viewport"
		  content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" th:href="@{/css/oksub.css}">
	<link rel="stylesheet" th:href="@{/layui_ext/dtree/dtree.css}">
	<link rel="stylesheet" th:href="@{/layui_ext/dtree/font/dtreefont.css}">
	<script type="text/javascript" th:src="@{/lib/loading/okLoading.js}"></script>
</head>
<body>
<div class="ok-body">
	<blockquote class="layui-elem-quote quoteBox">
		<form class="layui-form" lay-filter="searchForm">
			<div class="layui-inline">
				<a class="layui-btn layui-bg-cyan distScanner">分配扫描员</a>
			</div>
		</form>
	</blockquote>
	<!--数据表格-->
	<table class="layui-hide" id="tableId" lay-filter="tableFilter"></table>
</div>
<!--js逻辑-->
<script th:src="@{/lib/layui/layui.js}"></script>
<script th:inline="none">
	layui.extend({
		dtree: '/layui_ext/dtree/dtree'
	}).use(["element", "jquery", "table", "form", "laydate", "okLayer", "layer",
		"okUtils", "okMock","dtree"], function () {
		table = layui.table;
		form = layui.form;
		layer = layui.layer;
		laydate = layui.laydate;
		okLayer = layui.okLayer;
		okUtils = layui.okUtils;
		okMock = layui.okMock;
		$ = layui.jquery;
		dtree = layui.dtree;

		laydate.render({
			elem: "#startTime",
			type: "datetime"
		});
		laydate.render({
			elem: "#endTime",
			type: "datetime"
		});
		okLoading.close($);
		var userTable = table.render({
			elem: '#tableId',
			url: "/api/scan/receiptDocScan",
			id:"scanList",
			limit: 20,
			page: true,
			toolbar: true,
			toolbar: "#toolbarTpl",
			size: "sm",
			cols: [[{
				type: "checkbox",
				fixed: "left"
			}, {
				field: "id",
				title: "扫描编号",
				width: 100,
				sort: true
			}, {
				field: "waybillNumber",
				title: "运单编号",
				width: 100
			}, {
				field: "expressTypeName",
				title: "快件类型",
				width: 120
			}, {
				field: "itemTypeName",
				title: "物品类型",
				width: 150
			}, {
				field: "senderClient",
				title: "寄件人",
				width: 150
			}, {
				field: "receiver",
				title: "收件人",
				width: 100
			}, {
				field: "transportMethodName",
				title: "运输方式",
				width: 100
			}, {
				field: "paymentMethodName",
				title: "付款方式",
				width: 100
			}, {
				field: "sendNetworkName",
				title: "寄件网点",
				width: 100
			}, {
				field: "weight",
				title: "重量",
				width: 100
			}, {
				field: "takerName",
				title: "取件员",
				width: 100
			}, {
				field: "destinationName",
				title: "目的地",
				width: 100
			}, {
				field: "pouchId",
				title: "袋号",
				width: 100
			}, {
				field: "scanNetworkName",
				title: "目的网点",
				width: 100
			}]],
			done: function (res, curr, count) {
				console.info(res, curr, count);
			}
		});

		table.on("tool(tableFilter)", function (obj) {
			var data = obj.data;
			switch (obj.event) {
				case "receiveScan":
					scan(data.id);
					break;
			}
		});


		//扫描员分配
		$(".distScanner").click(function() {
			var checkData = table.checkStatus('scanList').data; //idTest 即为基础参数 id 对应的值
			console.log(checkData);
			if (checkData == null || checkData.length == 0) {
				layer.msg("请先选中需要分配的扫描单", {
					"icon" : 2
				});
				return;
			}

			class_layer = layer.open({
				type: 1,  //type:0 也行
				title: "选择员工",
				area: ["400px", "80%"],
				content: '<ul id="staffTree" class="dtree" data-id="0"></ul>',
				btn: ['确认选择'],
				success: function(layero, index){

					var DTree = dtree.render({
						obj: $("#staffTree"),
						url: "/api/scan/staffList",
						dataStyle: "layuiStyle",  //使用layui风格的数据格式
						dataFormat: "list" //配置data的风格为list
					});

				},
				yes: function(index, layero) {
					var param = dtree.getNowParam("staffTree"); // 获取当前选中节点

					console.log(param.nodeId);

					var scan_ids = new Array();

					for (var i = 0; i < checkData.length; i++) {
						scan_ids.push(checkData[i].id);
					}

					distScaner(param.nodeId, scan_ids.join(","));
				}
			});

		});

		//订单分配
		function distScaner(sid,oids) {
			$.get("/api/scan/distScaner",{
				staffId: sid,
				ordersId: oids
			},function(d) {
				if (d.code == 200) {
					layer.close(class_layer);
					userTable.reload();

				} else {
					layer.close(class_layer);
					layer.msg(d.msg, {icon: 2});
				}
			});
		}


	})
</script>


<!-- 行工具栏模板 -->
<script type="text/html" id="operationTpl">
</script>


</body>
</html>
